<template>
	<el-container>
		<el-header class='x-header'>
			<b class="title">{{ account__list.title==''?page_info.title:account__list.title }}</b>
			<el-button v-if="$route.query.callback_url" size="mini" icon="el-icon-back" @click="g_page.funcBack">
				返回
			</el-button>
			<el-button size="mini" type="success" icon="el-icon-edit" @click="g_page.funcRedirectEdit(`account__edit`)">
				添加
			</el-button>
			<el-button size="mini" type="danger" icon="el-icon-delete"
					   @click="g_page.funcDel">删除
			</el-button>
			<el-button size="mini" icon="el-icon-refresh" @click="g_page.funcReload()">刷新</el-button>
		</el-header>
		<el-main class='x-main'>
			<el-form :inline="true" :model="form_q" size="mini">
				<el-form-item label="名称">
					<el-input name="compKw" v-model="form_q.compKw" placeholder="名称"></el-input>
				</el-form-item>
				<el-form-item>
					<el-button type="primary" @click="g_page.funcSearch">搜索</el-button>
				</el-form-item>
			</el-form>
			<div class="table-wrap">
				<el-table stripe ref="multipleTable" tooltip-effect="dark" @selection-change="g_page.funcTableSelectionChange"
						  :data="list_data">
					<el-table-column type="selection"></el-table-column>
					<el-table-column label="账号">
						<template slot-scope="data">
							<div>
								{{data.row.uid}}
								<span v-if="data.row.acc_lock==1" style="color: red;">[停用]</span>
							</div>
						</template>
					</el-table-column>
					<el-table-column label="名称">
						<template slot-scope="data">
							<div v-html="data.row.acc_name"></div>
						</template>
					</el-table-column>
					<el-table-column label="角色">
						<template slot-scope="data">
							<div v-html="data.row.role_name"></div>
						</template>
					</el-table-column>
					<el-table-column label="状态">
						<template slot-scope="data">
							<div style="color:green;" v-if="data.row.vaild.errcode==0">正常</div>
							<div style="color:red;" v-else>
								{{ data.row.vaild.errmsg }}
								<div v-if="data.row.vaild.errcode==10073">
									<el-button type="text" size="mini" @click="funcResetLockDate(data.row)">解除锁定
									</el-button>
								</div>
							</div>
						</template>
					</el-table-column>
					<el-table-column fixed="right" label="操作">
						<template slot-scope="data">
							<el-button type="text" size="mini" @click="g_page.funcRedirectEdit('account__edit',data.row)">
								编辑
							</el-button>
							<el-button type="text" size="mini" @click="funcResetPwd(data.row)">重置密码</el-button>
						</template>
					</el-table-column>
				</el-table>
			</div>
		</el-main>
		<!---->
		<!---->
		<!-- 分页 -->
		<el-footer v-if="page_show" class="x-page">
			<el-pagination class="paging" background layout="total, sizes, prev, pager, next, jumper"
						   @current-change="g_page.funcPageChange" :page-sizes="[page_size]"
						   :current-page="page_index" :page-size="page_size" :total="page_total">
			</el-pagination>
		</el-footer>
		<!---->
		<!---->
		<!-- 弹框 -->
		<el-dialog title="编辑" :visible.sync="form_dialog_visible" width="70%">
			<el-form ref="form" :rules="form_rules" :model="form" size="mini" label-width="15%">
				<el-form-item label="账号" prop="acc_uid" :disabled="g_page.funcIsAdminAdd()">
					<el-input placeholder="请输入内容" v-model="form.acc_uid">
						<template slot="prepend">{{ super_uid }}@</template>
					</el-input>
					<!--          <el-input :disabled="g_page.funcIsAdminAdd()" v-model="form.acc_uid"/>-->
				</el-form-item>
				<el-form-item label="名称" prop="acc_name">
					<el-input v-model="form.acc_name"/>
				</el-form-item>
				<el-form-item label="身份" prop="acc_role">
					<el-radio :disabled="true" v-model="form.acc_role" label="user">超级管理员</el-radio>
					<el-radio v-model="form.acc_role" label="admin">管理员</el-radio>
				</el-form-item>
				<el-form-item label="停用" prop="acc_lock">
					<el-radio v-model="form.acc_lock" :label="1">是</el-radio>
					<el-radio v-model="form.acc_lock" :label="0">否</el-radio>
				</el-form-item>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button @click="g_page.funcBack" size="mini">取消</el-button>
				<el-button type="success" @click="g_page.funcSave" size="mini">保存</el-button>
			</div>
		</el-dialog>
		<!---->
		<!---->
		<!---->
	</el-container>
</template>


<script>
	export default {
		data() {
			let page_data = { super_uid: '' }
			page_data = this.g_cc.funcGetInitData(page_data)
			//
			page_data.account__list = this.g_cc.funcGetConfig('account__list', { title: '' })
			//
			return page_data
		},
		mounted() {
			console.log('mounted')
			//
			this.g_page.funcSetVue(this)
			// 应用ID
			this.g_page.funcSetApiUrlList('/xadmin/account/account__list')
			this.g_page.funcSetApiUrlSave('/xadmin/account/account__list/save')
			this.g_page.funcSetApiUrlDel('/xadmin/account/account__list/del')
			//页码
			this.g_page.funcSetPageSize(10)
			//搜索
			this.form_q = {
				'compKw': ''
			}
			this.g_page.funcGetList()
			//
			this.form_rules = {
				acc_uidX: [
					{
						required: true,
						message: '必填',
						trigger: 'blur'
					}
				]
			}
			//
		},
		methods: {
			funcGetListCommonSuccessAfter(res) {
				console.log('funcGetListCommonSuccessAfter')
			},
			funcSaveBefore(data) {
				console.log('funcSaveBefore')
				if (!this.g_page.funcIsAdminAdd()) {
					// delete data['acc_uid'];
				}

				return data
			},
			/**
			 * 重置密码
			 * @param row
			 */
			funcResetPwd(row) {
				console.log('funcResetPwd')
				let page = this
				page.g_cc.func_confirm('重置密码为123456，确认吗', function() {
					page.g_cc.func_axios({
						url: '/xadmin/account/account__list/reset_pwd',
						data: {
							ids: row.id
						},
						success: function(res) {
							if (res.data.errcode == 0) {
								page.g_cc.func_alert('密码重置成功')
							} else {
								page.g_cc.func_alert(res.data.errmsg, 'error')
							}
						}
					})
				})
			},
			/**
			 * 重置密码
			 * @param row
			 */
			funcResetLockDate(row) {
				console.log('funcResetLockDate')
				let page = this
				page.g_cc.func_confirm('解除锁定，确认吗', function() {
					page.g_cc.func_axios({
						url: '/xadmin/account/account__list/funcResetLockDate',
						data: {
							ids: row.id
						},
						success: function(res) {
							if (res.data.errcode == 0) {
								page.g_cc.func_alert('成功', 'success', () => {
									page.g_page.funcGetList()
								})
							} else {
								page.g_cc.func_alert(res.data.errmsg, 'error')
							}
						}
					})
				})
			}
			////////////////////
			////////////////////
		}
	}
</script>
